import AuthRoute from "@/components/AuthRoute";
//import Article from "@/pages/Article";
//import Home from "@/pages/Home";
import Layout from "@/pages/Layout/index,";

import Login from "@/pages/Login";
//import Publish from "@/pages/Pulish";
import { lazy, Suspense } from "react";

import { createBrowserRouter } from "react-router-dom";

//路由懒加载
//1.使用lazy方法导入路由组件
const Home=lazy(()=>import('@/pages/Home'))
const Article=lazy(()=>import('@/pages/Article'))
const Publish=lazy(()=>import('@/pages/Pulish'))


const router= createBrowserRouter([
    {
        path:"/",
        element:<AuthRoute><Layout/></AuthRoute>,
        children:[
            {
                index:true,
                //2.使用内置的Suspence组件渲染路由组件
                element:(
                    <Suspense fallback={'加载中'}>
                        <Home/>
                    </Suspense>
                )
            },
            {
                path:'article',
                element:(
                    <Suspense fallback={'加载中'}>
                        <Article/>
                    </Suspense>
                )
            },
            {
                path:'publish',
                element:(
                    <Suspense fallback={'加载中'}>
                        <Publish/>
                    </Suspense>
                )
            }
        ]
    },
    {
        path:'/login',
        element:<Login/>
    }
])

export default router